<template>
  <div>
    <el-card>
      <el-breadcrumb separator-class="el-icon-arrow-right">
        <div class="manager-all">
          <div class="project-manager"></div>
          <div class="project-item">
            <el-breadcrumb-item :to="{ path: '/' }"
            >基本信息
            </el-breadcrumb-item>
          </div>
        </div>
        <hr
          style="width: 1642px;
                 height: 1px;
                 border:none;
                 background: #E8ECF0;
                 margin-left:-23px;"
        />
      </el-breadcrumb>

    
      <div class="login-wrap">
        <div class="login-container" style="margin-top:30px;">
          <el-form
            :model="ruleForm"
            ref="ruleForm"
            :rules="rules"
            label-width="100px"
            class="demo-form-inline,form-button"
            style="border:1px solide red;"
            :hide-required-asterisk="true"
          >


            <el-row>
              <el-col :span="12">
              <el-form-item label="用户名称 :" prop="username">
                <el-input
                  type="text"
                  v-model="userList.username"
                  autocomplete="off"
                  style="width: 430px;"
                ></el-input>
              </el-form-item>
              </el-col>
              <el-col :span="12">
              <el-form-item label="所属部门 :">
                <el-input
                  type="text"
                  autocomplete="off"
                  v-model="userList.department"
                  style="width: 430px;"
                ></el-input>
               
              </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="12">
              <el-form-item label="手机号码 :">
                 <el-input
                  type="text"
                  autocomplete="off"
                  v-model="userList.phoneNumber"
                  style="width: 430px;"
                  :readonly="edit"
                ></el-input>
                <el-link
                    type="primary"
                    :underline="false"
                    v-show="showphone"
                    @click="phone"
                    style="margin-left: 15px;"
                  >修改</el-link
                  >
              </el-form-item>
              </el-col>
                <!-- <el-col :span="14">
                  <el-form
                    v-show="!showphone"
                    :model="phoneForm"
                    :rules="phonerules"
                    ref="phoneForm"
                    label-width="100px"
                    class="demo-form-inline,form-button"
                    style="border:1px solide red;"
                    :hide-required-asterisk="true"
                  >
                    <el-form-item style="margin-left:-100px;" prop="phone">
                      <el-input
                        type="text"
                        v-model="phoneForm.phone"
                        autocomplete="off"
                        placeholder="联系电话"
                      ></el-input>
                    </el-form-item>
                  </el-form>
                </el-col> -->
                <!-- <el-col :span="10">
                  <span v-show="showphone"
                  >{{ this.userList.phoneNumber }}17589245620</span
                  >
                </el-col> -->
                
                  
                  <!-- <el-link
                    type="primary"
                    :underline="false"
                    v-show="!showphone"
                    @click="submitphone('phoneForm')"
                  >保存</el-link
                  > -->
                  <!-- <el-link
                    type="primary"
                    :underline="false"
                    v-show="!showphone"
                    @click="
                      changephone();
                      resetPhone('phoneForm');
                    "
                  >取消</el-link
                  > -->
            <el-col :span="12">
              <el-form-item label="邮箱:" prop="email">
                   <el-input
                  type="text"
                  autocomplete="off"
                  v-model="pswForm.email"
                  style="width: 430px;"
                ></el-input>
                <el-link
                  type="primary"
                  :underline="false"
                  @click="psw();editemVisible=true"
                  style="margin-left:15px;"
                >修改</el-link
                >
              </el-form-item>
              </el-col>
              <el-col :span="12">
              <el-form-item label="密码:" prop="password">
                   <el-input
                   v-show="false"
                  type="password"
                  autocomplete="off"
                ></el-input>********
                <el-link
                  type="primary"
                  :underline="false"
                  @click="psw();editpswVisible=true"
                  style="margin-left:15px;"
                >修改</el-link
                >
              </el-form-item>
              </el-col>
            </el-row>

       
            
            
   <!-- 修改邮箱 -->
   <el-dialog
        title="修改邮箱"
        :visible.sync="editemVisible"
        width="520px"
        @close="emFormClosed">

      <div class="underline1"></div>
      <div class="under1"></div>

      <el-form
          :model="emailForm"
          :rules="emailrules"
          ref="emailForm"
          label-width="140px"
          style="height: 370px !important"
        >
      
      
            <el-col :span="24" style="margin-left: -100px;margin-top: 20px;">
              <el-form-item prop="email">
                      <el-row>
                        <el-col :span="20">
                          <span style="float: left;">原邮箱：</span>
                          <el-input
                            v-model="emailForm.email"
                            auto-complete="off"
                            style="float: left;width: 210px;"
                          ></el-input>
                        </el-col>
                        <el-col :span="4">
                          <el-button
                            type="primary"
                            size="small"
                            @click="getCode(emailForm.email)"
                            :disabled="!show"
                            style="margin-left:-7px;width:95px;padding-left:10px;height:40px;"
                          >
                            <span v-show="show">发送验证码</span>
                            <span v-show="!show" class="count"
                            >{{ count }}s后再次获取</span
                            >
                          </el-button>
                        </el-col>
                      </el-row>
                    </el-form-item>
               </el-col>
       

      <el-col :span="24">
          <el-row>
            <el-col :span="24">
              <el-form-item prop="emailcode" style="margin-left:-100px;margin-top: -10px;">
                      <el-row style="margin-top:18px;">
                        <el-col :span="21">
                          <span style="float: left;">验证码：</span>
                          <el-input
                            v-model.trim="emailForm.emailcode"
                            auto-complete="off"
                            style="float: left;width: 317px;"
                          ></el-input>
                        </el-col>
                      </el-row>
                    </el-form-item>

            </el-col>
          </el-row>
      </el-col>

       <el-col :span="24" style="margin-left: -100px;margin-top: -10px;">
              <el-form-item prop="newemail">
                      <el-row style="margin-top:18px;">
                        <el-col :span="20">
                          <span style="float: left;">新邮箱：</span>
                          <el-input
                            v-model="emailForm.newemail"
                            auto-complete="off"
                            style="float: left;width: 210px;"
                          ></el-input>
                        </el-col>
                        <el-col :span="4">
                          <el-button
                            type="primary"
                            size="small"
                            @click="getnewCode(emailForm.newemail)"
                            :disabled="!newshow"
                            style="margin-left:-7px;width:100px;padding-left:10px;height:40px;"
                          >
                            <span v-show="newshow">发送验证码</span>
                            <span v-show="!newshow" class="count"
                            >{{ newcount }}s后再次获取</span
                            >
                          </el-button>
                        </el-col>
                      </el-row>
                    </el-form-item>
            </el-col>
    
      
      <el-col :span="24">
          <el-row>
            <el-col :span="24">
              <el-form-item prop="emailcode" style="margin-left:-100px;margin-top: -10px;">
                      <el-row style="margin-top:18px;">
                        <el-col :span="21">
                          <span style="float: left;">验证码：</span>
                          <el-input
                            v-model.trim="emailForm.emailcode"
                            auto-complete="off"
                            style="float: left;width: 317px;"
                          ></el-input>
                        </el-col>
                      </el-row>
                    </el-form-item>
            </el-col>
          </el-row>
      </el-col>

      <el-col :span="24">
          <el-row>
                <div style="text-align: center;">
                 <el-button
                    type="primary"
                    size="small"
                    :underline="false"
                    style="margin-top: 25px;width: 140px;height: 40px;font-size:14px;"
                    @click="submitemail('emailForm')"
                  >确认</el-button
                  >
                </div>
          </el-row>
      </el-col>
    </el-form>
  </el-dialog>
                  <!-- <el-form
                    v-show="!showemail"
                    :model="emailForm"
                    :rules="emailrules"
                    ref="emailForm"
                    label-width="100px"
                    class="demo-form-inline,form-button"
                    style="border:1px solide red;"
                    :hide-required-asterisk="true"
                  >
                    <el-form-item prop="email" style="margin-left:-100px;">
                      <el-row>
                        <el-col :span="20">
                          <el-input
                            v-model="emailForm.email"
                            auto-complete="off"
                            placeholder="原邮箱"
                          ></el-input>
                        </el-col>
                        <el-col :span="3">
                          <el-button
                            type="primary"
                            size="small"
                            @click="getCode(emailForm.email)"
                            :disabled="!show"
                            style="margin-left:5px;width:100px;padding-left:10px;"
                          >
                            <span v-show="show">发送验证码</span>
                            <span v-show="!show" class="count"
                            >{{ count }}s后再次获取</span
                            >
                          </el-button>
                        </el-col>
                      </el-row>
                    </el-form-item>

                    <el-form-item prop="emailcode" style="margin-left:-100px;">
                      <el-row style="margin-top:18px;">
                        <el-col :span="20">
                          <el-input
                            v-model.trim="emailForm.emailcode"
                            auto-complete="off"
                            placeholder="验证码"
                          ></el-input>
                        </el-col>
                      </el-row>
                    </el-form-item>

                    <el-form-item prop="newemail" style="margin-left:-100px;">
                      <el-row style="margin-top:18px;">
                        <el-col :span="20">
                          <el-input
                            v-model="emailForm.newemail"
                            auto-complete="off"
                            placeholder="更改后的邮箱"
                          ></el-input>
                        </el-col>
                        <el-col :span="3">
                          <el-button
                            type="primary"
                            size="small"
                            @click="getnewCode(emailForm.newemail)"
                            :disabled="!newshow"
                            style="margin-left:5px;width:100px;padding-left:10px;"
                          >
                            <span v-show="newshow">发送验证码</span>
                            <span v-show="!newshow" class="count"
                            >{{ newcount }}s后再次获取</span
                            >
                          </el-button>
                        </el-col>
                      </el-row>
                    </el-form-item>

                    <el-form-item
                      prop="newemailcode"
                      style="margin-left:-100px;"
                    >
                      <el-row style="margin-top:18px;">
                        <el-col :span="20">
                          <el-input
                            v-model.trim="emailForm.newemailcode"
                            auto-complete="off"
                            placeholder="验证码"
                          ></el-input>
                        </el-col>
                      </el-row>
                    </el-form-item>
                  </el-form>
                </el-col> -->


                <!-- <el-col :span="8">
                  <el-link
                    type="primary"
                    :underline="false"
                    v-show="showemail"
                    @click="email"
                  >编辑</el-link
                  >
                  <el-link
                    type="primary"
                    :underline="false"
                    v-show="!showemail"
                    style="margin-left:-190px;margin-top: 230px;"
                    @click="submitemail('emailForm')"
                  >保存</el-link
                  >
                  <el-link
                    type="primary"
                    :underline="false"
                    v-show="!showemail"
                    style="margin-left:15px;margin-top: 230px;"
                    @click="
                      changeemail();
                      resetEmail('emailForm');
                    "
                  >取消</el-link
                  >
                </el-col> -->


    <!-- 修改密码 -->
   <el-dialog
        title="修改密码"
        :visible.sync="editpswVisible"
        width="500px"
        @close="pswFormClosed">
      
      
      <div class="underline"></div>
      <div class="under"></div>

      <el-form
          :model="pswForm"
          :rules="pswrules"
          ref="pswForm"
          label-width="140px"
          style="height: 330px !important"
        >
      
      
            <el-col :span="24" style="margin-left: -80px;">
              <el-form-item
                      prop="password"
                      style="margin-top:25px;"
                    >
                    <span style="float: left;">原密码：</span>
                      <el-input
                        type="password"
                        v-model.trim="pswForm.password"
                        auto-complete="off"
                        style="float: left;width: 260px;"
                      ></el-input>
                    </el-form-item>
               </el-col>
       

      <el-col :span="24" style="margin-left:-80px;">
          <el-row>
              <el-form-item
                      prop="newpassword"
                      style="margin-top:18px;"
                    >
                    <span style="float: left;">新密码：</span>
                      <el-input
                        type="password"
                        v-model.trim="pswForm.newpassword"
                        auto-complete="off"
                        style="float: left;width: 260px;"
                      ></el-input>
                    </el-form-item>
          </el-row>
      </el-col>

       <el-col :span="24" style="margin-left: -80px;">
              <el-form-item
                      prop="confirmPwd"
                      style="margin-top:18px;"
                    >
                    <span style="float: left;margin-left:-10px;">确认密码：</span>
                      <el-input
                        type="password"
                        v-model.trim="pswForm.confirmPwd"
                        auto-complete="off"
                        style="float: left;width: 260px;"
                      ></el-input>
                    </el-form-item>
            </el-col>
    
      <el-col :span="24">
          <el-row>
                <div style="text-align: center;">
                 <el-button
                    type="primary"
                    @click="submitpsw('pswForm')"
                    size="small"
                    :underline="false"
                    style="margin-top: 25px;width: 140px;height: 40px;font-size: 14px;"
                  >确认</el-button
                  >
                </div>
          </el-row>
      </el-col>
    </el-form>
  </el-dialog>



            <!-- <el-row :gutter="15">
              <el-form-item label="登录密码 :">
                <el-button
                  size="small"
                  v-show="showpsw"
                  @click="psw()"
                  style="margin-left:-243px;"
                >修改密码</el-button
                >
                <el-col :span="14" style="margin-top:18px;">
                  <el-form
                    v-show="!showpsw"
                    :model="pswForm"
                    :rules="pswrules"
                    ref="pswForm"
                    label-width="100px"
                    class="demo-form-inline,form-button"
                    style="border:1px solide red;"
                    :hide-required-asterisk="true"
                  >
                    <el-form-item
                      prop="password"
                      style="margin-top:-15px;margin-left:-100px;"
                    >
                      <el-input
                        type="password"
                        v-model.trim="pswForm.password"
                        auto-complete="off"
                        placeholder="原密码"
                      ></el-input>
                    </el-form-item>

                    <el-form-item
                      prop="newpassword"
                      style="margin-top:18px;margin-left:-100px;"
                    >
                      <el-input
                        type="password"
                        v-model.trim="pswForm.newpassword"
                        auto-complete="off"
                        placeholder="新密码"
                      ></el-input>
                    </el-form-item>

                    <el-form-item
                      prop="confirmPwd"
                      style="margin-top:18px;margin-left:-100px;"
                    >
                      <el-input
                        type="password"
                        v-model.trim="pswForm.confirmPwd"
                        auto-complete="off"
                        placeholder="确认密码"
                      ></el-input>
                    </el-form-item>
                  </el-form>
                </el-col>

                <el-col :span="8">
                  <el-link
                    type="primary"
                    :underline="false"
                    v-show="!showpsw"
                    @click="submitpsw('pswForm')"
                    style="margin-left:-170px;margin-top: 175px;"
                  >保存</el-link
                  >
                  <el-link
                    type="primary"
                    :underline="false"
                    v-show="!showpsw"
                    style="margin-left:15px;margin-top: 175px;"
                    @click="
                      changepsw();
                      resetPsw('pswForm');
                    "
                  >取消</el-link
                  >
                </el-col>
              </el-form-item>
            </el-row> -->
            <div style="text-align:center;margin-top:25px;">
            <el-button type="primary" class="bc" @click="submitemail('emailForm');submitpsw('pswForm');submitphone('phoneForm')">
             保存
            </el-button>
            </div>
          </el-form>
        </div>
      </div>
    </el-card>
  </div>
</template>

<script>
var TIME_COUNT = 60;
export default {
  name: "PersonalCenter",
  data() {
    var validatePhone = (rule, value, callback) => {
      var reg = /^1[345789]\d{9}$/;
      if (!value) {
        return callback(new Error("手机号不能为空"));
      } else if (!reg.test(value)) {
        callback(new Error("请输入正确的手机号格式"));
      } else {
        callback();
      }
    };
    var validateEmail = (rule, value, callback) => {
      const mailReg = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;
      if (!value) {
        return callback(new Error("邮箱不能为空"));
      }
      if (mailReg.test(value)) {
        callback();
      } else {
        callback(new Error("请输入正确的邮箱格式"));
      }
    };
    var validatenewEmail = (rule, value, callback) => {
      const mailReg = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;
      if (!value) {
        return callback(new Error("邮箱不能为空"));
      }
      if (mailReg.test(value)) {
        callback();
      } else {
        callback(new Error("请输入正确的邮箱格式"));
      }
    };
    var validatePass = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请确认密码"));
      } else if (value !== this.pswForm.newpassword) {
        callback(new Error("两次输入密码不一致!"));
      } else {
        callback();
      }
    };
    return {
      userList: [],
      newshow: true,
      show: true,
      count: "", // 初始化次数
      timer: null,
      newcount: "",
      newtimer: null,
      showphone: true,
      showemail: true,
      showpsw: true,
      editpswVisible: false,
      editemVisible: false,
      imageUrl: '',
      edit: true,
      emailForm: {
        email: "",
        newemail: "",
        newemailcode: "",
        emailcode: ""
      },
      pswForm: {
        password: "",
        newpassword: "",
        confirmPwd: ""
      },
      ruleForm: {
        username: "",
        department: ""
      },
      phoneForm: {
        phone: ""
      },
      rules: {},
      phonerules: {
        phone: [
          {
            required: true,
            validator: validatePhone,
            trigger: ["blur", "change"]
          }
        ]
      },
      emailrules: {
        email: [
          {
            required: true,
            validator: validateEmail,
            trigger: ["blur", "change"]
          }
        ],
        newemail: [
          {
            required: true,
            validator: validatenewEmail,
            trigger: ["blur", "change"]
          }
        ],
        emailcode: [{ required: true, message: "请输入验证码" }],
        newemailcode: [{ required: true, message: "请输入验证码" }]
      },
      pswrules: {
        confirmPwd: [
          {
            required: true,
            validator: validatePass,
            trigger: "blur"
          }
        ],
        password: [{ required: true, message: "请输入密码" }],
        newpassword: [{ required: true, message: "请输入密码" }]
      },
    };
  },
  created() {
    //页面渲染之前执行，调用定义的方法
    //3.调用定义的方法
    this.getUserList();
  },
  methods: {
    getUserList() {
      //2.使用axios发送ajax请求
      //axios.提交方式(“请求s接口路径”).then(箭头函数).catch(箭头函数|)
      this.$axios
        .get("/getInfo")
        .then(response => {
          //response就是请求后返回的数据，response可以任意取名
          // console.log(response)
          //通过response获取具体数据，赋值给定义空数组
          this.userList = response.data.data;
          console.log(this.userList)
        }) //请求成功执行then方法
        .catch(error => {
          this.$message({
            title: "提示",
            message: "获取失败，请尝试重新进入页面",
            duration: 2000,
            type: "error"
          });
        }); //请求失败执行catch方法
    },

    // 回去头像的请求
    getAvatar() {
      this.req
        .get("/login/getavatar")
        .then(response => {
          let data = response.data;
          this.avatarUrl =
            "http://127.0.0.1:666" + data[data.length - 1].imgUrl;
          // console.log(data[data.length - 1].imgUrl);
        })
        .catch(err => {
          console.log(err);
        });
    },

    handleAvatarSuccess(res, file) {
        this.imageUrl = URL.createObjectURL(file.raw);
      },
    beforeAvatarUpload(file) {
        const isJPG = file.type === 'image/jpeg';
        const isLt2M = file.size / 1024 / 1024 < 2;

        if (!isJPG) {
          this.$message.error('上传头像图片只能是 JPG 格式!');
        }
        if (!isLt2M) {
          this.$message.error('上传头像图片大小不能超过 2MB!');
        }
        return isJPG && isLt2M;
      },
    pswFormClosed(){
        this.editpswVisible = false;
      },
    emFormClosed(){
        this.editemVisible = false;
      },
    //提交修改的手机号
    submitphone(phoneForm) {
      this.$refs[phoneForm].validate(valid => {
        if (valid) {
          //这里写接口
          //没有接口先用这个代替
          this.$message({
            title: "提示",
            message: "修改联系电话成功！",
            duration: 2000,
            type: "success"
          });
          this.showphone = true;
        } else {
          return false;
        }
      });
    },
    //提交修改的邮箱
    submitemail(emailForm) {
      this.$refs[emailForm].validate(valid => {
        if (valid) {
          this.show = true;
          this.newshow = true;
          clearInterval(this.timer);
          this.timer = null;
          clearInterval(this.newtimer);
          this.newtimer = null;
          this.$axios({
            method: "POST",
            url: "/remakeEmail",
            headers: {
              "Content-Type": "application/json;charset=UTF-8"
            },
            data: {
              oldEmail: this.emailForm.email,
              oldAuthCode: this.emailForm.emailcode,
              newEmail: this.emailForm.newemail,
              newAuthCode: this.emailForm.newemailcode
            }
          })
            .then(res => {
              if (res.data.msg === "修改成功") {
                this.$message({
                  title: "提示",
                  message: "修改邮箱成功！",
                  duration: 2000,
                  type: "success"
                });
                this.showemail = true;
                this.getUserList();
              } else if (res.data.msg === "验证码过期，请重新获取") {
                this.$message({
                  title: "提示",
                  message: "验证码过期，请重新获取",
                  duration: 2000,
                  type: "warning"
                });
              } else if (res.data.msg === "验证码不正确") {

                this.$message({
                  message: "验证码错误",
                  type: "error"
                });
                return false;
              } else if (res.data.msg === "邮箱已经存在,请选择其他邮箱") {

                this.$message({
                  message: "邮箱已经存在,请选择其他邮箱",
                  type: "error"
                });
              } else {

                this.$message({
                  title: "提示",
                  message: "修改失败，请重试",
                  duration: 2000,
                  type: "error"
                });
              }
            })
            .catch(() => {

              this.$message({
                title: "提示",
                message: "请求超时，请检查网络连接",
                duration: 2000,
                type: "warning"
              });
            });
        }
      });
    },
    //提交修改的密码
    submitpsw(pswForm) {
      this.$refs[pswForm].validate(valid => {
        if (valid) {
          this.$axios({
            method: "POST",
            url: "/updatePw",
            headers: {
              "Content-Type": "application/json;charset=UTF-8"
            },
            data: {
              newPw: this.pswForm.newpassword,
              oldPw: this.pswForm.password
            }
          })
            .then(res => {
              if (res.data.msg === "修改成功") {

                this.$message({
                  title: "提示",
                  message: "修改密码成功!",
                  duration: 2000,
                  type: "success"
                });
                setTimeout(() => {
                  this.$cookies.remove("token");
                  this.$store.commit("logout", "false");
                  this.$router.push({ path: "/login" });
                  this.$message({
                    type: "success",
                    message: "请重新登录!"
                  });
                }, 3000);
              } else {

                this.$message({
                  title: "提示",
                  message: "修改失败，请重试",
                  duration: 2000,
                  type: "error"
                });
              }
            })
            .catch(() => {

              this.$message({
                title: "提示",
                message: "请求超时，请检查网络连接",
                duration: 2000,
                type: "warning"
              });
            });
        } else {
          return false;
        }
      });
    },
    //重置ruleform的phone内容
    resetPhone(phoneForm) {
      this.$refs.phoneForm.resetFields();
    },
    //重置emailform的内容
    resetEmail(emailForm) {
      this.$refs.emailForm.resetFields();
      this.show = true;
      this.newshow = true;
      clearInterval(this.timer);
      this.timer = null;
      clearInterval(this.newtimer);
      this.newtimer = null;
    },
    //重置pswform的内容
    resetPsw(pswForm) {
      this.$refs.pswForm.resetFields();
    },
    //phone,email,psw展示功能
    phone() {
      this.edit = false;
    },
    email() {
      this.showemail = false;
    },
    psw() {
      this.showpsw = false;
    },
    changeemail() {
      this.showemail = true;
    },
    changephone() {
      this.showphone = true;
    },
    changepsw() {
      this.showpsw = true;
    },
    //获取新、旧验证码
    getCode() {
      this.$refs.emailForm.validateField("email", emailError => {
        if (emailError) {
          return false;
        } else {
          if (!this.timer) {
            this.count = TIME_COUNT;
            this.show = false;
            this.timer = setInterval(() => {
              if (this.count > 0 && this.count <= TIME_COUNT) {
                this.count--;
              } else {
                this.show = true;
                clearInterval(this.timer); // 清除定时器
                this.timer = null;
              }
            }, 1000);
          }
          this.$axios
            .get("http://localhost:8081/sendEmail", {
              params: {
                email: this.emailForm.email
              }
            })
            .then(res => {

              this.$message({
                message: "已发送验证码",
                type: "success"
              });
            })
            .catch(res => {

              return (
                (this.show = true),
                  this.$message({
                    message: "请求超时，请检查网络连接",
                    type: "error"
                  })
              );
            });
        }
      });
    },
    getnewCode() {
      this.$refs.emailForm.validateField("newemail", emailError => {
        if (emailError) {
          return false;
        } else {
          if (!this.newtimer) {
            this.newcount = TIME_COUNT;
            this.newshow = false;
            this.newtimer = setInterval(() => {
              if (this.newcount > 0 && this.newcount <= TIME_COUNT) {
                this.newcount--;
              } else {
                this.newshow = true;
                clearInterval(this.newtimer); // 清除定时器
                this.newtimer = null;
              }
            }, 1000);
          }
          this.$axios
            .get("http://localhost:8081/sendEmail", {
              params: {
                email: this.emailForm.newemail
              }
            })
            .then(res => {

              this.$message({
                message: "已发送验证码",
                type: "success"
              });
            })
            .catch(res => {

              return (
                (this.show = true),
                  this.$message({
                    message: "请求超时，请检查网络连接",
                    type: "error"
                  })
              );
            });
        }
      });
    }
  }
}
</script>

<style scoped>
.manager-all {
  margin-top: 6px;
  display: flex;
  height: 30px;
  width: 100px;
  justify-content: center;
  margin-bottom: 30px;
}
.project-manager {
  width: 4px;
  height: 30px;
  background: #4087fc;
}

.underline {
  width: 80px;
  height: 3px;
  background: #4087fc;
  margin-top: -34px;
  float: left;
}
.under{
  width: 355px;
  height: 2px;
  background: #cbdcf8 !important;
  float: right;
  margin-right: 25px;
  margin-top: -33px;
}
.underline1{
  width: 80px;
  height: 3px;
  background: #4087fc;
  margin-top: -34px;
  float: left;
}
.under1{
  width: 380px;
  height: 2px;
  background: #cbdcf8;
  float: right;
  margin-right: 20px;
  margin-top: -33px;
}
.project-item {
  width: 72px;
  height: 18px;
  font-size: 18px;
  font-family: Microsoft YaHei;
  font-weight: 600px;
  color: #333333;
  margin-left: 10px;
  line-height: 30px;
}
.bc{
  width: 140px;
  height: 40px;
  background: #4087FC;
  border-radius: 4px;
  margin-top: 15px;

}
.el-avatar{
  width: 80px;
  height: 80px;
  background: #535151;
  opacity: 0.35;
  border-radius: 50%;
}
.row{
  position:relative;
  z-index:1 !important; 
  width: 80px;
  height: 80px;
  background: #000000;
  opacity: 1;
  border-radius: 50%;
  cursor: pointer;
}
.xgtx{
  position:absolute;
  z-index:100 !important;
  text-align:center;
  top: 25%;
  left: 15%;
  color: #FFFFFF !important;
}

</style>
<style>
.el-input__inner{
  background: #FFFFFF;
  border: 1px solid #E0E0E0;
}
</style>
